<div class="layout-content">
    <div style="float: left">    
        <h1>Baza filmów</h1>    
    </div>
    <div style="float: right">          
        <input name="AddNew" type="button" class="button blue" value="Dodaj nowy film"/>
    </div>    
    <div style="clear: both"></div>
</div>
<script type="text/javascript">
    $.fn.generateData = function(url)
    {        
        var _self = $(this);
        $.getJSON(url,function(data)
        {
            _self.find('.thumb').html('<img src="'+data.data.thumbnail.hqDefault+'"/>');
            _self.find('#description').html(data.data.description);
        });
    }
</script>
{Box name="flim.add" selfview="true"}
<div class="layout-content">
    {foreach from=$movies item=mov name=foo}
        <div class="film-thumb {$mov.hash}" id="film-thumb-{$smarty.foreach.foo.index}">
            <div class="thumb">                                 
            </div>
            <div class="description-block">
                <h4>{$mov.name|truncate:30:"..."}</h4>
                <p id="description">Trwa ładowanie opisu...</p>
            </div>
            <div style="clear: both"></div>
            <div class="bar">
                <img src="/local/movie_play.png" link="{$mov.link}" id="play-movie"/>
                <img src="/local/edit_trash.png" hash="{$mov.hash}" id="delete-movie" mov="{$mov.name}"/>
            </div>
        </div>
        <script type="text/javascript">                
                    $('#film-thumb-{$smarty.foreach.foo.index}').generateData("http://gdata.youtube.com/feeds/api/videos/{$mov.link}?v=2&alt=jsonc")
        </script>
    {/foreach}
</div>
